<template>
  <div>
    <el-badge
      v-for="num in randomQuestion.length"
      :key="num"
      :value="num < 10 ? '0' + num : num"
      class="item"
      :type="num==index+1?'primary':'info'"
      @click.native="goToNum(num-1)"
    >
    </el-badge>
  </div>
</template>

<script>
import { mapState,mapMutations,mapActions } from "vuex";
export default {
  data() {
    return {
    };
  },
  computed: {
    ...mapState("question", ["index","randomQuestion"]),
  },
  methods:{
      ...mapMutations("question", ["SET_INDEX"]),
      ...mapActions("question",["randomQuestionDataFn"]),
      goToNum(num){
          this.SET_INDEX(num)
      }
  },
  async mounted() {
    if(!this.randomQuestion){
      await this.randomQuestionDataFn()
    }
    console.log(this.randomQuestion)
  },
};
</script>

<style scoped>
.el-badge {
  line-height: 30px;
  cursor: pointer;
}

</style>